<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--<%
    Boolean isLoggedIn = (Boolean) session.getAttribute("isLoggedIn");
    if (isLoggedIn == null || !isLoggedIn) {
        response.sendRedirect("login.jsp"); // 如果用户未登录，重定向到登录页面
        return;
    }
%>--%>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>新闻管理 - 新闻发布系统</title>
    <link rel="stylesheet" href="css/style.css">
    <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">
    <style>
        .manage-container {
            max-width: 1200px;
            margin: 2rem auto;
            padding: 2rem;
            background-color: var(--card-bg);
            border-radius: 8px;
            box-shadow: 0 4px 6px var(--shadow-color);
            transition: all var(--transition-speed);
        }

        .manage-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 2rem;
            padding-bottom: 1rem;
            border-bottom: 1px solid var(--border-color);
        }

        .manage-header h1 {
            color: var(--text-color);
            font-size: 2rem;
        }

        .manage-actions {
            display: flex;
            gap: 1rem;
        }

        .search-box {
            position: relative;
            flex: 1;
            max-width: 300px;
        }

        .search-box input {
            width: 100%;
            padding: 0.8rem;
            padding-left: 2.5rem;
            border: 1px solid var(--border-color);
            border-radius: 4px;
            background-color: var(--card-bg);
            color: var(--text-color);
            transition: all var(--transition-speed);
        }

        .search-box i {
            position: absolute;
            left: 0.8rem;
            top: 50%;
            transform: translateY(-50%);
            color: var(--text-light);
        }

        .news-table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 1rem;
        }

        .news-table th,
        .news-table td {
            padding: 1rem;
            text-align: left;
            border-bottom: 1px solid var(--border-color);
            color: var(--text-color);
        }

        .news-table th {
            font-weight: 600;
            background-color: rgba(52, 152, 219, 0.1);
        }

        .news-table tr:hover {
            background-color: rgba(52, 152, 219, 0.05);
        }

        .news-table .actions {
            display: flex;
            gap: 0.5rem;
        }

        .news-table .btn-icon {
            padding: 0.5rem;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            transition: all var(--transition-speed);
            background: none;
            color: var(--text-color);
        }

        .news-table .btn-icon:hover {
            background-color: rgba(52, 152, 219, 0.1);
            color: var(--primary-color);
        }

        .news-table .btn-icon.delete:hover {
            background-color: rgba(231, 76, 60, 0.1);
            color: #e74c3c;
        }

        .pagination {
            display: flex;
            justify-content: center;
            align-items: center;
            margin-top: 2rem;
            gap: 1rem;
        }

        .pagination button {
            padding: 0.5rem 1rem;
            border: 1px solid var(--border-color);
            border-radius: 4px;
            background-color: var(--card-bg);
            color: var(--text-color);
            cursor: pointer;
            transition: all var(--transition-speed);
        }

        .pagination button:hover {
            background-color: var(--primary-color);
            color: white;
            border-color: var(--primary-color);
        }

        .pagination button.active {
            background-color: var(--primary-color);
            color: white;
            border-color: var(--primary-color);
        }

        .navbar-actions {
            display: flex;
            align-items: center;
            gap: 1rem;
        }
    </style>
</head>
<body>
    <header>
        <nav class="navbar">
            <div class="logo">
                <h1>新闻发布系统</h1>
            </div>
            <div class="navbar-actions">
                <ul class="nav-links">
                    <li><a href="index.jsp"><i class="fas fa-newspaper"></i> 查看新闻</a></li>
                    <li><a href="publish.jsp"><i class="fas fa-edit"></i> 发布新闻</a></li>
                    <li><a href="manage.html" class="active"><i class="fas fa-cog"></i> 新闻管理</a></li>
                    <li><a href="login.jsp"><i class="fas fa-user"></i> 管理员登录</a></li>
                </ul>
                <div class="clock-container">
                    <i class="fas fa-clock"></i>
                    <div class="clock-time" id="clockTime">00:00:00</div>
                    <div class="clock-date" id="clockDate">2024-03-15</div>
                </div>
                <button class="theme-toggle" id="themeToggle" title="切换主题">
                    <i class="fas fa-moon"></i>
                </button>
            </div>
        </nav>
    </header>

    <main>
        <div class="manage-container">
            <div class="manage-header">
                <h1>新闻管理</h1>
                <div class="manage-actions">
                    <div class="search-box">
                        <i class="fas fa-search"></i>
                        <input type="text" placeholder="搜索新闻..." id="searchInput">
                    </div>
                    <a href="publish.jsp" class="btn">
                        <i class="fas fa-plus"></i> 发布新闻
                    </a>
                </div>
            </div>
            <table class="news-table">
                <thead>
                    <tr>
                        <th>标题</th>
                        <th>分类</th>
                        <th>发布时间</th>
                        <th>状态</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <!-- 示例数据 -->
                    <tr>
                        <td>人工智能技术的最新突破</td>
                        <td>科技</td>
                        <td>2024-03-15</td>
                        <td>已发布</td>
                        <td class="actions">
                            <button class="btn-icon" title="编辑">
                                <i class="fas fa-edit"></i>
                            </button>
                            <button class="btn-icon delete" title="删除">
                                <i class="fas fa-trash"></i>
                            </button>
                        </td>
                    </tr>
                    <tr>
                        <td>全球经济发展趋势分析</td>
                        <td>商业</td>
                        <td>2024-03-14</td>
                        <td>已发布</td>
                        <td class="actions">
                            <button class="btn-icon" title="编辑">
                                <i class="fas fa-edit"></i>
                            </button>
                            <button class="btn-icon delete" title="删除">
                                <i class="fas fa-trash"></i>
                            </button>
                        </td>
                    </tr>
                </tbody>
            </table>
            <div class="pagination">
                <button><i class="fas fa-chevron-left"></i></button>
                <button class="active">1</button>
                <button>2</button>
                <button>3</button>
                <button><i class="fas fa-chevron-right"></i></button>
            </div>
        </div>
    </main>

    <footer>
        <p>&copy; 2024 新闻发布系统 版权所有</p>
    </footer>

    <script>
        // 时钟功能
        function updateClock() {
            const now = new Date();
            const timeElement = document.getElementById('clockTime');
            const dateElement = document.getElementById('clockDate');
            
            // 更新时间
            const hours = String(now.getHours()).padStart(2, '0');
            const minutes = String(now.getMinutes()).padStart(2, '0');
            const seconds = String(now.getSeconds()).padStart(2, '0');
            timeElement.textContent = `${hours}:${minutes}:${seconds}`;
            
            // 更新日期
            const year = now.getFullYear();
            const month = String(now.getMonth() + 1).padStart(2, '0');
            const day = String(now.getDate()).padStart(2, '0');
            dateElement.textContent = `${year}-${month}-${day}`;
        }

        // 初始化时钟并每秒更新
        updateClock();
        setInterval(updateClock, 1000);

        // 主题切换功能
        const themeToggle = document.getElementById('themeToggle');
        const themeIcon = themeToggle.querySelector('i');
        
        // 检查本地存储中的主题设置
        const currentTheme = localStorage.getItem('theme') || 'light';
        document.documentElement.setAttribute('data-theme', currentTheme);
        updateThemeIcon(currentTheme);

        themeToggle.addEventListener('click', () => {
            const newTheme = document.documentElement.getAttribute('data-theme') === 'light' ? 'dark' : 'light';
            document.documentElement.setAttribute('data-theme', newTheme);
            localStorage.setItem('theme', newTheme);
            updateThemeIcon(newTheme);
        });

        function updateThemeIcon(theme) {
            themeIcon.className = theme === 'light' ? 'fas fa-moon' : 'fas fa-sun';
        }

        // 搜索功能
        document.getElementById('searchInput').addEventListener('input', function(e) {
            const searchTerm = e.target.value.toLowerCase();
            const rows = document.querySelectorAll('.news-table tbody tr');
            
            rows.forEach(row => {
                const title = row.cells[0].textContent.toLowerCase();
                const category = row.cells[1].textContent.toLowerCase();
                if (title.includes(searchTerm) || category.includes(searchTerm)) {
                    row.style.display = '';
                } else {
                    row.style.display = 'none';
                }
            });
        });

        // 删除确认
        document.querySelectorAll('.btn-icon.delete').forEach(button => {
            button.addEventListener('click', function() {
                if (confirm('确定要删除这条新闻吗？')) {
                    // 这里添加删除逻辑
                    this.closest('tr').remove();
                }
            });
        });
    </script>
</body>
</html> 